@function px2rem($px) {
    $rem: 37.5px;
    @return ($px/$rem)+rem;
}

* {
    margin: 0;
    padding: 0;
    background-repeat: no-repeat;
   
}

body {
    font-family: Microsoft YaHei, sans-serif;
    /*移动端默认的字体*/
    font-size: 14px;
    color: #333;
 
}
html,body{
       height:100%;
}
a{
     text-decoration:none;
}
ol,
ul {
    list-style: none;
}

.top {
    width: 100%;
    height: px2rem(85px);
    background-color: #f2f2f2;
    position: fixed;
    top: px2rem(-0.1px);
    left: 0;
    right: 0;
    z-index: 999; 
   
}

.header {
    width: 100%;
    height: px2rem(50px);
}

.header_logo {
    width: px2rem(52px);
    height: px2rem(50px);
    float: left;
    text-align: center;
}

.header_logo img {
    width: px2rem(25px);
    height: px2rem(16px);
    margin-bottom: px2rem(17px);
    margin-top: px2rem(17px);
}

.header_text {
    width: px2rem(270px);
    height: px2rem(33px);
    position: relative;
    background-color: #fff;
    float: left;
    margin-top: px2rem(9px);
}

.header_text img {
    width: px2rem(20px);
    height: px2rem(20px);
    display: block;
    float: left;
    padding-left: px2rem(5px);
    padding-top: px2rem(7px);
}

.header_text p {
    float: left;
    font-size: px2rem(16px);
    color: silver;
    line-height: px2rem(33px);
}

.header_user {
    width: px2rem(52px);
    height: px2rem(50px);
    float: left;
    text-align: center;
}

.header_user img {
    width: px2rem(20px);
    height: px2rem(20px);
    padding-bottom: px2rem(15px);
    padding-top: px2rem(15px);
}

.nav {
    overflow: hidden;
    /* 溢出隐藏*/
    overflow-x: auto;
    /*溢出 提供滚动条*/
    font-size: px2rem(14px);
    z-index: 2;
    height: px2rem(35px);
}

.nav-content {
    white-space: nowrap;
    /*文本不换行*/
    display: inline-block;
    /*让元素横向排列*/
    width: auto;
}

.nav-item {
    display: inline-block;
    color: #3c3c3c;
    padding: 0 px2rem(13px);
}

.nav-item span {
    height: px2rem(35px);
    line-height: px2rem(35px);
}

.nav-color {
    color: #ed5b00;
    border-bottom: 0.0533333333rem solid #ed5b00; 
}

.nav::-webkit-scrollbar {
    display: none;
}


/*轮播图*/

//  *,
//::before,
//::after{
//  padding: 0;
//  margin: 0;
//  -webkit-box-sizing: border-box;/*兼容移动端主流浏览器*/
//  box-sizing: border-box;
//  -webkit-tap-highlight-color: transparent;/*清除移动端点击高亮效果*/
//}

/*清除浮动*/

.clearfix::before,
.clearfix::after {
    content: "";
    display: block;
    height: 0;
    line-height: 0;
    visibility: hidden;
    clear: both;
}

.layout {
    width: 100%;
    max-width: px2rem(750px);
    min-width: px2rem(320px);
    margin: 0 auto;
    position: relative;
}

.banner {
    width: 100%;
    overflow: hidden;
    position: relative;
}

.banner ul:first-child {
    width: 1000%;
    -webkit-transform: translateX(-10%);
    transform: translateX(-10%);
}

.banner ul:first-child li {
    width: 10%;
    float: left;
}

.banner ul:first-child li a {
    display: block;
    width: 100%;
}

.banner ul:first-child li a img {
    width: 100%;
    height: px2rem(187px);
    display: block;
}

.banner ul:last-child {
    position: absolute;
    bottom: px2rem(6px);
    width: 100%;
    text-align: center;
}

.banner ul:last-child li {
    width: px2rem(6px);
    height: px2rem(6px);
    border: px2rem(1px) solid #fff;
    border-radius: 50%;
    display: inline-block;
    margin-left: px2rem(10px);
}

.banner ul:last-child li:first-child {
    margin-left: 0;
}

.banner ul:last-child li.now {
    background: #fff;
}

.footer {
    width: px2rem(375px);
    height: px2rem(50px);
    background: #FFFFFF;
    position: fixed;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 9999;
}

.footer-ul li {
    width: px2rem(93px);
    float: left;
    line-height: px2rem(50px);
    text-align: center;
}

.footer-ul li span {
    font-size: px2rem(14px);
}


/*main中间总容器*/

.main-ul::before,
.main-ul::after {
    content: "";
    display: block;
    height: 0;
    line-height: 0;
    visibility: hidden;
    clear: both;
}

.main {
    width: px2rem(375px);
    height: px2rem(532px);
   height: 100%;
    overflow: hidden;
    position: relative;
}

.main-ul {
    position: absolute;
    top: px2rem(85px);
    left: 0;
    right: 0;
    width: px2rem(3750px);
    height: 100%;
    overflow: hidden;
    
    padding-bottom: px2rem(135px);
    box-sizing: border-box;
    //  transform: translateX(px2rem(-375px)); //第一张不显示
    //  -webkit-transform: translateX(px2rem(-375px));
}

.main-ul>li {
    float: left;
    width: px2rem(375px);
    height: 100%;
    overflow-y: auto;
}
//.main-ul>li::-webkit-scrollbar {
//  display: none;
//}
.main .div2 {
    width: px2rem(375px);
    height: px2rem(532px);
    background-color: #C0C0C0;
}

.main .div1 {
    width: px2rem(375px);
    height: px2rem(532px);
    background-color: #FF0000;
}


/*middle_nav中间导航*/

.middle_nav {
    width: px2rem(375px);
    height: px2rem(80px);
    overflow: hidden;
}

.middle_nav_a {
    float: left;
    width: px2rem(75px);
    overflow: hidden;
}

.middle_nav_a img {
    width: px2rem(75px);
    height: px2rem(80px);
}


/*分割背景*/

.divider_line {
    width: px2rem(375px);
    height: px2rem(7px);
    background-color: rgb(245, 245, 245);
}


/*推荐*/

.recommend {
    position: relative;
    width: px2rem(375px);
    height: px2rem(265px);
}

.recommend_left {
    width: px2rem(186px);
    height: px2rem(264px);
    position: absolute;
}

.recommend_right_top {
    width: px2rem(186px);
    height: px2rem(131px);
    position: absolute;
    top: 0;
    left: px2rem(189px);
}

.recommend_right_bottom {
    width: px2rem(186px);
    height: px2rem(131px);
    position: absolute;
    bottom: 0;
    left: px2rem(189px);
}

.recommend_left img {
    width: px2rem(186px);
    height: px2rem(264px);
}

.recommend_right_top img {
    width: px2rem(186px);
    height: px2rem(131px);
}

.recommend_right_bottom img {
    width: px2rem(186px);
    height: px2rem(131px);
}

.recommend_block{
    width: px2rem(375px);
    height: px2rem(145px);
}
.recommend_block img{
    width: px2rem(375px);
    height: px2rem(145px);
}

.everyday_head{
    width: px2rem(375px);
    height: px2rem(229px);
}
.everyday_head .item{
     width: px2rem(375px);
    height: px2rem(229px);
}
.everyday_head .item img{
    width: px2rem(375px);
    height: px2rem(229px);
}

.everyday_content{
    width: px2rem(375px);
    margin-top: px2rem(2px);
}
.everyday_content .everyday_content_list{
    width:px2rem(375px);
    height: px2rem(265px);
}
.everyday_content .everyday_content_list .item:first-child{
    width: px2rem(186.5px);
    height: px2rem(264px);
    float: left;
    margin-right: px2rem(2px);
}
.everyday_content .everyday_content_list .item{
    width: px2rem(186.5px);
    height: px2rem(264px);
    float: left;
    position: relative;
}
.everyday_content .everyday_content_list .img{
    width: px2rem(186.5px);
    height: px2rem(186.5px);
}
.everyday_content .everyday_content_list .img img{
     width: px2rem(186.5px);
    height: px2rem(186.5px);
}
.everyday_content .info{
    width: px2rem(186.5px);
    height: px2rem(77px);
    padding: px2rem(10px) px2rem(15px);
    box-sizing: border-box;
    text-align: left;
}
.main .name,.main .brief{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
      
}
.everyday_content .name{
    font-size: px2rem(14px);
    color: #404040; 
}
.everyday_content .brief{
    font-size: px2rem(12px);
    color: #808080;
}
.everyday_content .price{
    font-size: px2rem(14px);
    color: #ea625b;
}
.everyday_content .price del{
    font-size: px2rem(10px);
    color: #b0b0b0;
}
.everyday_content .discount{
    width: px2rem(70px);
    height: px2rem(18px);
    position: absolute;
    top: 0;
    left: 0;
    background: #ED5B00;
    
}
.everyday_content .discount p{
    color: #FFFFFF;
    font-size: px2rem(6px);
    text-align: center;
    line-height: px2rem(18px);   
}

/*手机页面*/
.banner_sj{
    border-bottom: px2rem(1px) solid rgba(0,0,0,0.1);
}

.hotsale{
    width: px2rem(375px);
    height: px2rem(40px);    
}
.hotsale .items {
    height: auto;
    display: block;
}
.hotsale .items img{
    width: px2rem(375px);
    height: px2rem(40px); 
}
.hotsaleqishi{
       width: px2rem(375px);
   height: px2rem(70px); 
}
.hotsaleqishi a{
     display: block;
     height: auto;
}
.hotsaleqishi .qishigaodu img{
     width: px2rem(375px);
    height: px2rem(70px); 
}
 
.content_one{
    width: px2rem(375px);


}
.content_one .container{
    width: px2rem(365px);
    height: px2rem(300px);
    display: block;
 padding: 0 px2rem(5px);
}
.content_one .imgcon{
     width: px2rem(365px);
    height: px2rem(227px);
}
.content_one .imgcon img{
     width: px2rem(365px);
    height: px2rem(227px);
}

.content_one .info{
    width: px2rem(365px);
    height: px2rem(73px);
    padding: px2rem(10px) px2rem(20px);
    box-sizing: border-box;
    background: #fff;
}

.content_one .info_top{
    width: px2rem(325px);
    height: px2rem(23px);
    
}

.content_one .name{
    float: left;
    width: px2rem(200px);
    line-height: px2rem(23px);
    font-size: px2rem(16px);
    color: rgba(0,0,0,0.85);
}

.content_one .price{
    float: right;
    height: px2rem(23px);
    font-size: px2rem(14px);
    color: #EA625B;
    line-height: px2rem(23px);
}
.content_one .price del{
    color: #B0B0B0;
    font-size: px2rem(12px);
    margin: 0 px2rem(4px);
    height: px2rem(23px);
}

.content_one .info_bot{
     width: px2rem(325px);
    height: px2rem(30px);
}

.content_one .brief{
    width: px2rem(200px);
    color: #B0B0B0;
    font-size: px2rem(13px);
    float: left;
    line-height: px2rem(30px);
}
.content_one .bottom{
    width: px2rem(104px);
    line-height: px2rem(30px);
    text-align: center;
    float: right;
    font-weight: 700;
    color: #FFF;
    background: #EA625B;
    border-radius: px2rem(3px);
}
.divider_linezi{
    width: px2rem(375px);
    height: px2rem(5px);
  
}
.content_two{
    width: px2rem(375px);
    height: px2rem(250px);
  
}

.content_two .container{
    width: px2rem(180px);
    height: px2rem(250px);
    display: block;
    float: left;
}
.content_two .conone{  
    padding: 0 px2rem(5px);
}

.content_two .imgcon{
    width: px2rem(180px);
    height: px2rem(145px);   
}
.content_two .imgcon img{
    width: px2rem(180px);
    height: px2rem(145px);   
}

.content_two .info{
    width: px2rem(150px);
    height: px2rem(85px);
    padding: px2rem(10px) px2rem(15px);
    background: #FFFFFF;
    text-align: center;
}

.content_two .name{
    width: px2rem(150px);
    line-height: px2rem(16px);
 
}
.content_two .brief{
    width: px2rem(150px);
    line-height: px2rem(16px);

}
.content_two .price{
  font-size: px2rem(14px);
 
    color: #EA625B;
    line-height: px2rem(23px);
}
.content_two .price del{
    color: #B0B0B0;
    font-size: px2rem(12px);
    margin: 0 px2rem(4px);
}
.content_two .bottom{
    width: px2rem(104px);
    line-height: px2rem(30px);
   margin: 0 auto;
    font-weight: 700;
    color: #FFF;
    background: #EA625B;
    border-radius: px2rem(3px);
}

.content_single{
    width: px2rem(375px);
    height: px2rem(250px);
}

.content_single .container{
    width: px2rem(375px);
     height: px2rem(250px);
}
.content_single .imgcon{
  width: px2rem(375px);
     height: px2rem(190px);
     position: relative;  
}
.content_single .imgcon img{
     width: px2rem(375px);
     height: px2rem(190px);
}
.content_single .info{
    width: px2rem(345px);
     height: px2rem(40px);
     padding: px2rem(10px) px2rem(15px);
}
.content_single .info_top{
     width: px2rem(345px);
     height: px2rem(22px);
}
.content_single .info_bot{
     width: px2rem(345px);
     height: px2rem(18px);
}
.content_single .name{
    color: rgba(0,0,0,0.8);
    font-size: px2rem(14px);
    float: left;
}
.content_single .price{
    color: #EA625B;
    font-size: px2rem(12px);
    float: right;
}
.content_single .brief{
    color: rgba(0,0,0,0.5);
    font-size: px2rem(10px);
    float: left;
}
.content_single del{
    color: rgba(0,0,0,0.5);
    font-size: px2rem(10px);
    float: right;
}
.discount{
    width: px2rem(60px);
    height: px2rem(15px);
    background: #EA625B;
    color:#E5E5E5;
    font-size: px2rem(8px);
    text-align: center;
    line-height: px2rem(15px);
    position: absolute;
    top: 0;
    left: 0;
}

.imgcontent{
    width: px2rem(375px);
    height: 100%;
}
.imgcontent .imgcon_top,.imgcontent .imgcon_top img{
    width: px2rem(375px);
    height: px2rem(475px);
}
.imgcontent .imgtitel_top,.imgcontent .imgtitel_top img{
    width: px2rem(375px);
    height: px2rem(65px);
}
.imgcontent .imgcon_twohundred_fifty,.imgcontent .imgcon_twohundred_fifty img{
    width: px2rem(375px);
    height: px2rem(250px);
}
.imgcontent .imgtitel_eighty,.imgcontent .imgtitel_eighty img{
     width: px2rem(375px);
    height: px2rem(80px);
}
.imgcontent .imgtitle_Fifty,.imgcontent .imgtitle_Fifty img{
    width: px2rem(375px);
    height: px2rem(50px);
}
.imgcontent .imgcon_twohundred_four,.imgcontent .imgcon_twohundred_four img{
     width: px2rem(375px);
    height: px2rem(204px);
}
.qmpcontent_top{
    width: px2rem(375px);
    
}
.qmpcontent_top .item{
    width: px2rem(375px);
    height: px2rem(187px);
}
.qmpcontent_top .item img{
    width: px2rem(375px);
    height: px2rem(187px);
}
.qmpcontent_top .title{
    width: px2rem(375px);
    height: px2rem(103px);
}
.qmpcontent_top .title img{
    width: px2rem(375px);
    height: px2rem(103px);
}